<template>
    <el-tabs type="border-card" @tab-click="serviceItemFn($event)">
        <el-tab-pane v-for="item in serviceItem" :key="item.id"  class="itemList">
            <span slot="label" :dataId="item.id">{{item.serviceItemGroupName}}</span>
            <el-checkbox-group v-model="bandStore" @change="selectStoreFn">
                <el-checkbox-button class="bandStore" v-for="store in serviceItem_list" :label="store.id" :key="store.id">{{store.name}}</el-checkbox-button>
            </el-checkbox-group>
        </el-tab-pane>
        <!--<el-button type="success" @click="ShelfFn()"><i class="el-icon-plus"></i>绑定</el-button>-->
    </el-tabs>
</template>

<script>

    import {
        storeAsGet
    } from '../api/api';
    export default {
        data() {
            return {
                serviceItem: null,
                serviceItemId: null,
                serviceItem_list: null,
                bandStore: [],
                tagsList: []
            }
        },
        methods: {
            getServerItem(){//获取服务栏目
                storeAsGet('serviceItem/group/all/status?direction=DESC&propertys=serviceItemGroupName&status=NORMAL').then(res =>{
                    this.serviceItem = res.data.content.list;
                    this.serviceItemId = this.serviceItem[0].id;
                    this.getServerInfoItem(this.serviceItem[0].id)
                })
            },
            serviceItemFn(e){//获取当前项目下内容列表
                this.serviceItemId = e.$vnode.key;
                this.getServerInfoItem(this.serviceItemId)
            },
            getServerInfoItem(id){
                storeAsGet('serviceItem/group/status?groupId='+id+'&status=NORMAL').then(res=>{
                    this.serviceItem_list = res.data.content.list;
                });
                storeAsGet('shop/serviceItem/relation/shopId?shopId='+id).then(res=>{
                })
            },
            selectStoreFn(arr){
                this.bandStore = arr;
            },
        },
        computed: {
        },
        created(){
            this.getServerItem();
        }
    }

</script>


<style>

</style>
